<style>
@media print {
  ._wz_companyDetails {
    height: inherit !important;
    -webkit-print-color-adjust: exact;
    font-size: 12px !important;
  }
}
</style>

<template>
  <div ref="companyDetails" class="_wz_companyDetails" id="_wz_companyDetails">
    <Form>
      <table cellpadding="0" cellspacing="0" border="0">
        <colgroup>
          <col width="13%">
          <col width="20%">
          <col width="13%">
          <col width="20%">
          <col width="13%">
          <col width="20%">
        </colgroup>
        <tbody>
        <tr>
          <td style="font-weight: 600;position:relative;" colspan="6">
            基本信息
            <Button type="primary" @click="printTest" class="no-print" style="position: absolute;right: 10px;top: 8px;">
              打印
            </Button>
          </td>
        </tr>
        <tr>
          <td colspan="2" rowspan="4">
            <div class="demo-upload-list">
              <viewer style="width: 100%;height: 100%; display: flex;align-items: center;justify-content: center;">
                <img :src="!!seeCarData.deptPic?apiUrl.imgUrl+seeCarData.deptPic:'../../static/img/zwtpxd.png'" @error="public.imgDispose">
              </viewer>
            </div>
          </td>
          <td style="text-align: right;font-weight: 600;">运输企业</td>
          <td colspan="3">{{!!seeCarData.deptName ? seeCarData.deptName : '--'}}</td>
        </tr>
        <tr>
          <td style="text-align: right;font-weight: 600;">法人姓名</td>
          <td>{{!!seeCarData.legalPerson ? seeCarData.legalPerson : '--'}}</td>
          <td style="text-align: right;font-weight: 600;">企业类型</td>
          <td>{{!!seeCarData.transportValue ? seeCarData.transportValue : '--'}}</td>
        </tr>
        <tr>
          <td style="text-align: right;font-weight: 600;">联系人</td>
          <td>{{!!seeCarData.contact ? seeCarData.contact : '--'}}</td>
          <td style="text-align: right;font-weight: 600;">联系电话</td>
          <td>{{!!seeCarData.phone ? seeCarData.phone : '--'}}</td>
        </tr>
        <tr>
          <td style="text-align: right;font-weight: 600;">企业负责人</td>
          <td>{{!!seeCarData.personCharge ? seeCarData.personCharge : '--'}}</td>
          <td style="text-align: right;font-weight: 600;">负责人电话</td>
          <td>{{!!seeCarData.personChargePhone ? seeCarData.personChargePhone : '--'}}</td>
        </tr>
        <tr>
          <td style="text-align: right;font-weight: 600;">行政区域</td>
          <td>{{!!seeCarData.provinceCode?seeCarData.provinceName+' '+seeCarData.cityName+' '+seeCarData.countyName:''}}</td>
          <td style="text-align: right;font-weight: 600;">企业邮箱</td>
          <td>{{!!seeCarData.email ? seeCarData.email : '--'}}</td>
          <td style="text-align: right;font-weight: 600;">企业地址</td>
          <td>{{!!seeCarData.address ? seeCarData.address : '--'}}</td>
        </tr>
        <tr>
          <td style="text-align: center;font-weight: 600;" colspan="3">营业执照</td>
          <td style="text-align: center;font-weight: 600;" colspan="3">经营许可证</td>
        </tr>
        <tr>
          <td  colspan="3">
            <div class="demo-upload-list">
              <viewer style="width: 100%;height: 100%; display: flex;align-items: center;justify-content: center;">
                <img :src="!!seeCarData.uniformSocialCreditImg?apiUrl.imgUrl+seeCarData.uniformSocialCreditImg:'../../static/img/zwtpxd.png'" @error="public.imgDispose">
              </viewer>
            </div>
            <div style="text-align: center;line-height: 30px;">{{!!seeCarData.uniformSocialCreditCode?seeCarData.uniformSocialCreditCode:'--'}}</div>
          </td>
          <td  colspan="3">
            <div class="demo-upload-list">
              <viewer style="width: 100%;height: 100%; display: flex;align-items: center;justify-content: center;">
                <img :src="!!seeCarData.transportBusinessLicenseImg?apiUrl.imgUrl+seeCarData.transportBusinessLicenseImg:'../../static/img/zwtpxd.png'" @error="public.imgDispose">
              </viewer>
            </div>
            <div style="text-align: center;line-height: 30px;">{{!!seeCarData.transportBusinessLicenseCode?seeCarData.transportBusinessLicenseCode:'--'}}</div>
          </td>
        </tr>
        </tbody>
      </table>
    </Form>


  </div>
</template>
<script>
export default {
  props: ['selectData'],//接收来自父组件的数据
  data() {
    return {
      //车辆数据
      seeCarData: {},
      pStyle: {//抽屉内容p标签样式
        fontSize: '16px',
        color: 'rgba(0,0,0,0.85)',
        lineHeight: '24px',
        display: 'block',
        marginBottom: '16px'
      },

    }
  },
  beforeCreate() {//beforeCreate创建前状态

  },
  created() {//created创建完毕状态

  },
  beforeMount() {//beforeMount挂载前状态   DOM 元素然后塞入页面的过程

  },
  mounted() {//mounted 挂载结束状态
    let that = this;
    //车辆修改详情
    that.axios.post(that.apiUrl.webApi + "/core/dept/coreDeptInfo", {uuid: that.selectData.deptUuid}).then(res => {
      that.spinShow = false;
      if (!!res) {
        that.seeCarData = res.data.data;
      }
    }).catch(err => {
      console.log("失败", err)
    })
  },
  methods: {//执行的方法
    printTest() {
      this.$print(this.$refs.companyDetails) // 使用
    },

  },
  watch: {//监听

  },
  beforeUpdate() {//beforeUpdate 更新前状态

  },
  updated() {//updated 更新完成状态

  },
  beforeDestroy() {//beforeDestroy 销毁前状态

  },
  destroyed() {//destroyed 销毁完成状态

  }
}
</script>
<style lang="less">
._wz_companyDetails {
  height: 100%;
  overflow: auto;

  table {
    table-layout: fixed;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 12px !important;

    td {
      min-width: 0;
      height: 40px;
      box-sizing: border-box;
      text-align: left;
      text-overflow: ellipsis;
      border: 1px solid #515a6e;
      padding: 0 10px;
      word-break: break-word;
    }
  }

  .demo-upload-list {
    margin: 5px auto;
    width: 200px;
    height: 140px;
    text-align: center;
    line-height: 140px;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    position: relative;

    img {
      min-height: 30%;
      max-height: 90%;
      min-width: 30%;
      max-width: 90%;
      //width: 100%;
      //height: 100%;
    }
  }


}

</style>
